<template>
  <div>
    <a-card :bordered="false" style="margin-bottom:14px;">
      <a-row type="flex">
        <a-form-model v-bind="formItemLayout" @keyup.enter.native="searchQuery">
          <a-col :span="8">
            <a-form-model-item label="导入时间" class="form-model-flex">
              <!-- {{'2020-01-88 12:44:44'|moment('HH:mm:ss')}} -->
              <!-- <a-range-picker v-model="rangePickerTime" @change="rangePickerChange" valueFormat="YYYY-MM-DD" /> -->
              <a-date-picker
                v-model="queryParam.startTime"
                placeholder="开始时间"
                :disabled-date="disabledStartDate1"
                valueFormat="YYYY-MM-DD HH:mm:ss"
                :show-time="{ defaultValue: moment('00:00:00', 'HH:mm:ss') }"
                @openChange="handleStartOpenChange($event, 1)"
              />
              <span class="line">-</span>
              <a-date-picker
                v-model="queryParam.endTime"
                placeholder="结束时间"
                :disabled-date="disabledEndDate1"
                valueFormat="YYYY-MM-DD HH:mm:ss"
                :show-time="{ defaultValue: moment('23:59:59', 'HH:mm:ss') }"
                :open="endOpen1"
                @openChange="handleEndOpenChange($event, 1)"
              />
            </a-form-model-item>
          </a-col>
          <a-col :span="8">
            <a-form-model-item label="下发时间" class="form-model-flex">
              <a-date-picker
                v-model="queryParam.releaseStartTime"
                placeholder="开始时间"
                :disabled-date="disabledStartDate2"
                valueFormat="YYYY-MM-DD HH:mm:ss"
                :show-time="{ defaultValue: moment('00:00:00', 'HH:mm:ss') }"
                @openChange="handleStartOpenChange($event, 2)"
              />
              <span class="line">-</span>
              <a-date-picker
                v-model="queryParam.releaseEndTime"
                placeholder="结束时间"
                :disabled-date="disabledEndDate2"
                valueFormat="YYYY-MM-DD HH:mm:ss"
                :show-time="{ defaultValue: moment('23:59:59', 'HH:mm:ss') }"
                :open="endOpen2"
                @openChange="handleEndOpenChange($event, 2)"
              />
            </a-form-model-item>
          </a-col>
          <a-col :span="8">
            <a-form-model-item label="发现时间" class="form-model-flex">
              <a-date-picker
                v-model="queryParam.discoveryStartTime"
                placeholder="开始时间"
                :disabled-date="disabledStartDate3"
                valueFormat="YYYY-MM-DD HH:mm:ss"
                :show-time="{ defaultValue: moment('00:00:00', 'HH:mm:ss') }"
                @openChange="handleStartOpenChange($event, 3)"
              />
              <span class="line">-</span>
              <a-date-picker
                v-model="queryParam.discoveryEndTime"
                placeholder="结束时间"
                :disabled-date="disabledEndDate3"
                valueFormat="YYYY-MM-DD HH:mm:ss"
                :show-time="{ defaultValue: moment('23:59:59', 'HH:mm:ss') }"
                :open="endOpen3"
                @openChange="handleEndOpenChange($event, 3)"
              />
            </a-form-model-item>
          </a-col>
          <a-col :span="8">
            <a-form-model-item label="预警账号">
              <a-input v-model="queryParam.victimAccount" placeholder="请输入" />
            </a-form-model-item>
          </a-col>
          <a-col :span="8">
            <a-form-model-item label="失败原因">
              <a-input v-model="queryParam.resource" placeholder="请输入" />
            </a-form-model-item>
          </a-col>
          <a-col :span="8">
            <a-form-model-item label="状态">
              <a-select v-model="queryParam.status" placeholder="请选择">
                <template v-for="item in statusData">
                  <a-select-option :key="item.value" :value="item.value">{{ item.name }}</a-select-option>
                </template>
              </a-select>
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item :wrapper-col="{ offset: 0 }">
              <a-space>
                <a-button type="primary" @click="searchQuery"> 查询 </a-button>
                <a-button @click="searchReset"> 重置 </a-button>
              </a-space>
            </a-form-model-item>
          </a-col>
        </a-form-model>
      </a-row>
    </a-card>
    <div class="main-content">
      <!-- table区域-begin -->
      <div class="btnBox">
        <a-button type="primary" @click="onBatchDeal">批量处理</a-button>
        <downLoadComponents
          ref="downLoadComponents"
          :formData="exportDowmData"
          :apiUrl="downUrl"
          :fileText="fileText + '.xls'"
        >
          <a-button type="primary" @click="onExportDowm">
            导出
          </a-button>
        </downLoadComponents>
      </div>
      <div style="margin-top:10px;">
        <!--:rowSelection="{...,getCheckboxProps:getCheckboxProps} -->
        <a-table
          ref="table"
          size="default"
          rowKey="id"
          :columns="columns"
          :dataSource="dataSource"
          :pagination="ipagination"
          :loading="loading"
          class="j-table-force-nowrap"
          :rowSelection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
          @change="handleTableChange"
        >
          <template slot="status" slot-scope="text">
            <span v-if="text == '1'">成功</span>
            <span v-else-if="text == '0'" style="color:red;">失败</span>
            <sapn v-else></sapn>
          </template>
        </a-table>
      </div>
    </div>
  </div>
</template>

<script>
import moment from 'moment'
import { publicApi, batchDeal } from '@/api/LogManagement.js'
import { postAction } from '@/api/manage'
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
import downLoadComponents from '@/components/zxd/downLoad'
export default {
  components: {
    downLoadComponents
  },
  mixins: [JeecgListMixin],
  data() {
    return {
      moment,
      formItemLayout: {
        labelCol: { span: 5 },
        wrapperCol: { span: 19 }
      },
      endOpen1: false,
      endOpen2: false,
      endOpen3: false,
      // 表头
      columns: [
        // {
        //   title: '序号',
        //   dataIndex: '',
        //   key: 'rowIndex',
        //   // width: 100,
        //   // align: 'center',
        //   customRender: (text, record, index) =>
        //     `${(this.ipagination.current - 1) * this.ipagination.pageSize +
        //       (index + 1)}` //序号分页后连续
        // },
        {
          title: '数据来源',
          dataIndex: 'sourceFrom'
        },
        {
          title: '预警编号',
          // align:"center",
          dataIndex: 'warningNumber'
        },
        {
          title: '数据来源-dr',
          // align:"center",
          dataIndex: 'sourceFromDr'
        },
        {
          title: '预警风险特征',
          // align:"center",
          dataIndex: 'fraudType'
        },
        {
          title: '预警等级',
          // align:"center",
          dataIndex: 'warningLevel'
        },
        {
          title: '预警账号',
          // align:"center",
          dataIndex: 'victimAccount'
        },
        {
          title: '上报单位',
          // align:"center",
          dataIndex: 'reportUnit'
        },
        {
          title: '处理单位',
          // align:"center",
          dataIndex: 'dealUnit'
        },
        {
          title: '下发时间',
          // align:"center",
          dataIndex: 'releaseTime'
        },
        {
          title: '发现时间',
          // align:"center",
          dataIndex: 'discoveryTime'
        },
        {
          title: '最近联系时间',
          // align:"center",
          dataIndex: 'lastConcatTime'
        },
        {
          title: '归属地',
          // align:"center",
          dataIndex: 'homeLocation'
        },
        {
          title: '归属运营商',
          // align:"center",
          dataIndex: 'belongBank'
        },
        {
          title: '通话次数',
          // align:"center",
          dataIndex: 'numberCalls'
        },
        {
          title: '通话时长',
          // align:"center",
          dataIndex: 'durationCalls'
        },
        {
          title: '交易时间',
          // align:"center",
          dataIndex: 'tradeTime'
        },
        {
          title: '交易金额',
          // align:"center",
          dataIndex: 'tradeAmount'
        },
        {
          title: '交易发生地',
          // align:"center",
          dataIndex: 'tradeLocation'
        },
        {
          title: '交易结果',
          // align:"center",
          dataIndex: 'tradeResult'
        },
        {
          title: '登录次数',
          // align:"center",
          dataIndex: 'accessNumber'
        },
        {
          title: '登录时长',
          // align:"center",
          dataIndex: 'accessTime'
        },
        {
          title: '登陆网址',
          // align:"center",
          dataIndex: 'accessDomainName'
        },
        {
          title: '受害人姓名',
          // align:"center",
          dataIndex: 'victimName'
        },
        {
          title: '受害人身份证',
          // align:"center",
          dataIndex: 'victimIdCard'
        },
        {
          title: '受害人手机号',
          // align:"center",
          dataIndex: 'victimPhone'
        },
        {
          title: '受害人银行卡',
          // align:"center",
          dataIndex: 'victimBankAccount'
        },
        {
          title: '受害人活动地区',
          // align:"center",
          dataIndex: 'victimActivity'
        },
        {
          title: '嫌疑人姓名',
          // align:"center",
          dataIndex: 'suspectsCname'
        },
        {
          title: '嫌疑人身份证',
          // align:"center",
          dataIndex: 'suspectsIdNumber'
        },
        {
          title: '嫌疑人手机号',
          // align:"center",
          dataIndex: 'suspectsPhoneNumber'
        },
        {
          title: '嫌疑人银行卡',
          // align:"center",
          dataIndex: 'suspectsBankAccount'
        },
        {
          title: '嫌疑人活动地区',
          // align:"center",
          dataIndex: 'suspectsActivity'
        },
        {
          title: '入库时间',
          // align:"center",
          dataIndex: 'createTime'
        },
        {
          title: '状态',
          // align:"center",
          dataIndex: 'status',
          scopedSlots: { customRender: 'status' }
        },
        {
          title: '失败原因',
          // align:"center",
          dataIndex: 'resource'
        },
        {
          title: '导入时间',
          // align:"center",
          dataIndex: 'exportTime'
        },
        {
          title: '操作人',
          // align:"center",
          dataIndex: 'exportUser'
        },
        {
          title: '更新时间',
          // align:"center",
          dataIndex: 'updateTime'
        }
      ],
      statusData: [
        { value: '', name: '全部' },
        { value: '1', name: '成功' },
        { value: '0', name: '失败' }
      ],
      rangePickerTime: [],
      queryParam: { status: '' },
      url: {
        list: publicApi.getDataList,
        exportXlsUrl: publicApi.exportExcel
      },
      exportDowmData: { idList: [], gaDataDetailQueryVO: {} },
      fileText: '公安部数据导入日志-导出',
      downUrl: publicApi.exportExcel
    }
  },
  created() {},
  methods: {
    // 自定义时间
    rangePickerChange(date) {
      this.$set(this.queryParam, 'startTime', date[0])
      this.$set(this.queryParam, 'endTime', date[1])
      console.log('this.queryParam', this.queryParam)
    },
    searchReset() {
      // this.rangePickerTime = undefined
      this.queryParam = { status: '' }
      this.loadData(1)
    },
    onBatchDeal() {
      let that = this
      // var ids = this.selectedRowKeys.join(",")
      if (this.selectedRowKeys.length <= 0) {
        this.$message.warning('请选择一条记录！')
        return
      }
      this.$confirm({
        title: '确定更正数据状态？',
        onOk() {
          batchDeal(that.selectedRowKeys)
          .then(res => {
            if (res.success) {
              that.$message.success(res.message)
              that.loadData()
              that.onClearSelected()
            } else {
              that.$message.warning(res.message ? res.message : '请求失败！')
            }
          })
          .catch(e => {
            that.$message.warning('请求失败！')
          })
          .finally(() => {})
          }
      })
    },
    getCheckboxProps(record) {
      return {
        props: {
          disabled: record.status === '1',
          name: record.realName
        }
      }
    },
    loadData(arg) {
      if (!this.url.list) {
        this.$message.error('请设置url.list属性!')
        return
      }
      //加载数据 若传入参数1则加载第一页的内容
      if (arg === 1) {
        this.ipagination.current = 1
      }
      var params = this.getQueryParams() //查询条件
      this.loading = true
      postAction(this.url.list, params)
        .then(res => {
          if (res.success) {
            //update-begin---author:zhangyafei    Date:20201118  for：适配不分页的数据列表------------
            this.dataSource = res.result.records || res.result
            if (res.result.total) {
              this.ipagination.total = res.result.total
            } else {
              this.ipagination.total = 0
            }
            //update-end---author:zhangyafei    Date:20201118  for：适配不分页的数据列表------------
          } else {
            this.$message.warning(res.message ? res.message : '请求失败')
          }
        })
        .finally(() => {
          this.loading = false
        })
    },
    onExportDowm() {
      this.exportDowmData = {
        idList: this.selectedRowKeys,
        gaDataDetailQueryVO: this.queryParam
        // gaDataDetailQueryVO: {
        //   endTime: this.queryParam.endTime,
        //   startTime: this.queryParam.startTime,
        //   status: this.queryParam.status,
        //   victimPhone: this.queryParam.victimPhone
        //   // pageNo: this.ipagination.current,
        //   // pageSize:this.ipagination.pageSize
        // }
      }
      this.$nextTick(() => {
        this.$refs.downLoadComponents.exportDowmPOST()
        this.onClearSelected()
      })
    },
    // 导入时间
    disabledStartDate1(startValue) {
      const endValue = this.getTimeValue(this.queryParam, 'endTime') //this.endValue
      if (!startValue || !endValue) {
        return false
      }
      return startValue.valueOf() > endValue.valueOf()
    },
    // 导入时间
    disabledEndDate1(endValue) {
      const startValue = this.getTimeValue(this.queryParam, 'startTime') //this.startValue
      if (!endValue || !startValue) {
        return false
      }
      return startValue.valueOf() >= endValue.valueOf()
    },
    // 下发时间
    disabledStartDate2(startValue) {
      const endValue = this.getTimeValue(this.queryParam, 'releaseEndTime') //this.endValue
      if (!startValue || !endValue) {
        return false
      }
      return startValue.valueOf() > endValue.valueOf()
    },
    // 下发时间
    disabledEndDate2(endValue) {
      const startValue = this.getTimeValue(this.queryParam, 'releaseStartTime') //this.startValue
      if (!endValue || !startValue) {
        return false
      }
      return startValue.valueOf() >= endValue.valueOf()
    },
    // 发现时间
    disabledStartDate3(startValue) {
      const endValue = this.getTimeValue(this.queryParam, 'discoveryEndTime') //this.endValue
      if (!startValue || !endValue) {
        return false
      }
      return startValue.valueOf() > endValue.valueOf()
    },
    // 发现时间
    disabledEndDate3(endValue) {
      const startValue = this.getTimeValue(this.queryParam, 'discoveryStartTime') //this.startValue
      if (!endValue || !startValue) {
        return false
      }
      return startValue.valueOf() >= endValue.valueOf()
    },
    handleStartOpenChange(open, type) {
      let fill = 'endOpen'+type
      if (!open) {
        this[fill] = true
      }
    },
    handleEndOpenChange(open, type) {
      let fill = 'endOpen'+type
      this[fill] = open
    },
    getTimeValue(obj, field) {
      const value = Object.keys(obj).length > 0 && obj[field] ? this.moment(obj[field]) : null
      return value
    }
  }
}
</script>

<style lang="less" scoped>
.title {
  color: rgba(0, 0, 0, 0.85);
  font-size: 16px;
  font-weight: 500;
  margin-bottom: 16px;
}
.main-content {
  background: #fff;
  padding: 24px;
}
.btnBox {
  // margin-top: 20px;
  display: flex;
  .ant-btn {
    margin-right: 10px;
  }
}
/deep/.ant-form-item {
  margin-bottom: 6px;
}
.form-model-flex {
  /deep/.ant-form-item-children {
    display: flex;
    align-items: center;
    .ant-calendar-picker {
      min-width: 47% !important;
    }
    .line {
      padding: 0 4px;
    }
  }
}
</style>
